<%@page import="java.util.Map"%>
<%@ page language="java" pageEncoding="UTF-8"%>
<%
	String path = request.getContextPath();
	String basePath = request.getScheme() + "://"
			+ request.getServerName() + ":" + request.getServerPort()
			+ path + "/";
%>

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
<html>
<head>
<base href="<%=basePath%>">

<title>部门添加</title>
<meta http-equiv="pragma" content="no-cache">
<meta http-equiv="cache-control" content="no-cache">
<meta http-equiv="expires" content="0">
<meta http-equiv="keywords" content="keyword1,keyword2,keyword3">
<meta http-equiv="description" content="This is my page">
<link type="text/css" rel="stylesheet" href="css/materialize.min.css"
	media="screen,projection" />
<meta name="viewport"
	content="width=device-width, initial-scale=1.0, maximum-scale=1.0, user-scalable=no" />
</head>
<body>
  <script type="text/javascript" src="https://code.jquery.com/jquery-2.1.1.min.js"></script>
  <script type="text/javascript" src="js/materialize.min.js"></script>
		<%
 			Object obj = request.getAttribute("users");
			if (obj == null) {
 				System.out.println("Can not find any user. Send a query to get all users.");
 				response.sendRedirect("testQuery");
			} else {
 				System.out.println("users : " + (Map) obj);
			}
		%>
<%-- 		users : "${users}" --%>
<script type="text/javascript">
$(document).ready( function() {
    var total = Math.ceil($("ul li").length / 3);
    var current = 1;
    $("ul li:gt(2)").hide();
    $("#btnPrev").attr("disabled", "disabled").click( function() {
        $("#btnNext").removeAttr("disabled");
        current -= 1;
        $("ul li").show();
        var indexStart = (current - 1) * 3;
        var indexEnd = indexStart + 2;
        $("li:lt(" + indexStart + "), li:gt(" + indexEnd + ")", $("ul")).hide();
        if (current == 1) $(this).attr("disabled", "disabled");
    });
    $("#btnNext").click( function() {
        $("#btnPrev").removeAttr("disabled");
        current += 1;
        $("ul li").show();
        var indexStart = (current - 1) * 3;
        var indexEnd = current * 3 - 1 > $("ul li").length - 1 ? $("ul li").length - 1 : current * 3 - 1;
        $("li:lt(" + indexStart + "), li:gt(" + indexEnd +")", $("ul")).hide();
        if (current == total) $(this).attr("disabled", "disabled");
    });
});
</script>
</head>
 
<body>
<ul>
    <li>01</li>
    <li>02</li>
    <li>03</li>
    <li>04</li>
    <li>05</li>
    <li>06</li>
    <li>07</li>
</ul>
<input type="button" id="btnNext" value="下一页" /><input type="button" id="btnPrev" value="上一页" />
</body>
</html>
